<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style>
        .item { width: 120px; border:solid 1px red;}
        .item.w2 { width: 400px; }
    </style>
</head>
<body>
<div id="container" style="width:700px;">
    <div class="item">
       adfad<br>
        adfad<br>
        adfad<br>adfad<br>
        adfad<br>
        adfad<br>adfad<br>
        adfad<br>
      dfadfadf
        adfadfadfad<br>
    </div>
    <div class="item">
        adfad<br>adfad<br>
        adfad<br>
        a
        dfadfadf
        adfadfadfad<br>
    </div>
    <div class="item">
        adfad<br>adfad<br>
        adfad<br>
        adfad<br>adfad<br>
        adfad<br>
        dfadfadf
        adfadfadfad<br>
    </div>
    <div class="item">
        adfad<br>adfad<br>
        adfad<br>

        adfadfadfad<br>
    </div>
    <div class="item">
        adfad<br>adfad<br>
        adfad<br>
        adfad<br>adfad<br>

        adfadfadfad<br>
    </div>
    <div class="item">
        adfad<br>adfad<br>
        adfad<br>
        adfad<br>adfad<br>
        adfad<br>
        dfadfadf
        adfadfadfad<br>
    </div>
    <div class="item">
        adfad<br>adfad<br>

        dfadfadf
        adfad<br>adfad<br>

        dfadfadf
        adfad<br>adfad<br>

        dfadfadf
        adfadfadfad<br>
    </div>
    <div class="item">
        adfad<br>adfad<br>

        dfadfadf
        adfadfadfad<br>
    </div>
    <div class="item">
        adfad<br>adfad<br>

        dfadfadf
        adfad<br>adfad<br>

        dfadfadf
        adfad<br>adfad<br>

        dfadfadf
        adfad<br>adfad<br>

        dfadfadf
        adfadfadfad<br>
    </div>

</div>
<script src="http://masonry.desandro.com/masonry.pkgd.min.js"></script>
<script>
    var container = document.querySelector('#container');
    var msnry = new Masonry( container, {
        // options
        columnWidth: 5,
        itemSelector: '.item'
    });
</script>
</body>
</html>